<template>

  <!-- <date-picker class="picker" :date="endTime" :option="option" :limit="limit"></date-picker> -->
  <div class="order-list-option">
    <!-- 预约日期： -->
    <date-picker :date="endTime" :option="option" :limit="limit" v-model="endTime.time"></date-picker>
  </div>
</template>

<script>
import global from '../../utils/global'
import Datepicker from 'vue-datepicker/vue-datepicker-es6.vue';
let moment = require('moment');
export default {
  name: "calendar",
  components:{
    'date-picker': Datepicker
  },
  data() {
    return {
      startTime: {
        time: '',
      },
      endTime: {
        time: '',
      },
      option: {
        type: 'day',
        week: ['一', '二', '三', '四', '五', '六', '日'],
        month: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
        format: 'YYYY-MM-DD',
        placeholder: 'when?',
        inputStyle: {
          'display': 'inline-block',
          'padding': '0px',
          'font-size': '0.95rem',
          'border': '0px solid #fff',
          'border-radius': '2px',
          'color': '#5F5F5F',
          'width': '100%'
        },
        color: {
          header: '#ccc',
          headerText: '#f00',
        },
        buttons: {
          ok: '确定',
          cancel: '取消',
        },
        overlayOpacity: 0.5,
        dismissible: true,
      },
      timeoption: {
        type: 'min',
        week: ['一', '二', '三', '四', '五', '六', '日'],
        month: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
        format: 'YYYY-MM-DD HH:mm'
      },
      multiOption: {
        type: 'multi-day',
        week: ['一', '二', '三', '四', '五', '六', '日'],
        month: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
        format:"YYYY-MM-DD HH:mm"
      },
      limit: [
        {
          type: Array,
          default:function _default(){
            return [];
          },
        },
        {
          type: 'fromto',
          from: '2018-07-01',
          to: ''
        }
      ],
    }
  },
  mounted() {
    this.LopTime();
    this.getLocalTime();
    // this.getTime();
  },
  beforeUpdate(){   //该钩子在服务器端渲染期间不被调用，因为只有初次渲染会在服务端进行。
    this.getThisTime();
  },
  props: [''],
  computed: {},
  methods: {
    getTime(){
      let week = [        //把一周七天用数组的形式方便获取时间索引
        '星期日',
        '星期一',
        '星期二',
        '星期三',
        '星期四',
        '星期五',
        '星期六'
      ]
      this.startTime.time = moment().format("YYYY-MM-DD")
      this.endTime.time = moment().format("YYYY-MM-DD")
    },
    LopTime(){
      // setInterval(this.getTime,1000)   //对获取的时间，用定时器让它动起来，定时器中调用getTime方法，注意不能加（），调用函数
      this.getTime()
    },
    getLocalTime(data){
     this.limit[1].from = moment(Date.now() - 24 * 60 * 60 * 1000).format("YYYY-MM-DD");
     global.order.date = moment().format("YYYY-MM-DD");
     global.order.today = moment().format("YYYY-MM-DD");
    },
    getThisTime(){
      global.order.date = this.endTime.time;
    },
  }
}
</script>
<style scoped>
  .order-list-option{
    line-height: 1.3rem;
  }
</style> 